import React from "react";
import {Link,IndexLink} from "react-router";
import { Row, Col, Menu, Icon,Button,Modal,Tabs,Input,Form ,message,Checkbox   } from 'antd';
import {post} from "../../../utils/http.js";



const SubMenu = Menu.SubMenu;
const MenuItemGroup = Menu.ItemGroup;
const TabPane = Tabs.TabPane;
const FormItem = Form.Item;

import "../../../../css/mobile/denglu.less";
import "../../../../css/mobile/loginInput.less"

class Denglu extends React.Component{
    constructor(){
        super();
        this.state={
            username:"",
            userpassword:"",
            nameblur:false,
            wordblur:false,
            flag:false
            
        }
    };
    //获取用户名
    usernam(event){
        this.setState({
            username:event.target.value
        });
        console.log(this.state.username)
    };
    //获取密码
    userpass(event){
        this.setState({
            userpassword:event.target.value
        })
        
    };
    //判断输入完用户名和密码之后
    usernameblur(){
        this.setState({
            nameblur:true
        })
    };
    userpasswordblur(){
        this.setState({
            wordblur:true
        });
        let {user,password,userflag,passwordflag}=this.state;
        console.log(user)
         if(true){
             var result=post("http://localhost:3000/sel",{
              username:this.state.username,
              password:this.state.userpassword
             }).then(rel=>{
                 return rel.json();
             }).then(json=>{
                 console.log(json);
                 if(typeof json=="object"){
                  localStorage.setItem("username",json[0].username);
                  if(json[0]){
                      this.setState({
                          flag:true
                      })
                  }
                 }
                 
             })
         }
    };
   //点击登陆，连接数据库
   loginClick(){
       
   }
    render(){
        let data=this.state.flag?<Link to="/my">登录</Link>:"登录"
        
        return(
            <div className="denglu">
                <div className="mobile_hnav">
                        <p >
                            <Link to="/my">
                                <span >&#xe606;</span>
                                登录
                            </Link>
                        </p>
                   
                </div>
                <div className="longinInput">
                    <div>
                    <span> &#xe602;</span>
                    <span>&#xe61e; </span>
                    <input value={this.state.username} onBlur={this.usernameblur.bind(this)}  onChange={this.usernam.bind(this)} type="text" placeholder="请输入账号"/>
                    <input value={this.state.userpassword} onBlur={this.userpasswordblur.bind(this)} onChange={this.userpass.bind(this)} type="text" placeholder="请输入密码"/>
                   
                    </div>
                    {console.log(data)}
                    <p onClick={this.loginClick.bind(this)}>{ data} </p>
                </div>
                
                <div className="xiaosan">
                    <p>一键登录,成为易家人</p>
                    <span>&#xe60b;</span>
                    <span>&#xe609;</span>
                    <span>&#xe605;</span>
                </div>
            </div>
        )
    }
}
export default Denglu;

